'use client'

import { Dispatch,ReactNode,useReducer,SetStateAction,createContext,useMemo,useState ,useContext} from "react"
import { Action, State,reducer,initialState} from "@/reducers/AppReducer"


// type State = {
//     dispalyNavigation: boolean
// }
// type AppCOntextProps = {
//     state:State
//     setState: Dispatch<SetStateAction<State>>
// }
type AppCOntextProps = {
    state:State
    dispatch: Dispatch<Action>
}


// 创建Context
const AppContext = createContext<AppCOntextProps>(null!)  

export function useAppContext() {
    return useContext(AppContext)
}
export default function AppCOntextProvider({children}:{children:ReactNode}) {
    const [test,setTest] = useState(false)
    console.log('AppCOntextProvider render')
    // const [state,setState] = useState<State>({dispalyNavigation:true})
    const [state,dispatch] = useReducer(reducer,initialState)
    const contextValue = useMemo(()=> {
        return {state,dispatch}
    },[state,dispatch])
    return (
        // value={{state,setState}}
        <AppContext.Provider  value={contextValue}>
            {/* <button
                onClick={() => {
                    setTest((v) => !v)
                }}
            >
                AppContext Test
            </button> */}
            {children}
        </AppContext.Provider>
    )

}